@import "standard.less";
@import "iconfont/iconfont.css";
//样式初始化
* {
  padding: 0;
  margin: 0;
}

body, html, #app {
  width: 100%;
  height: 100%;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  overflow: hidden;
}

img {
  max-width: 100%;
  border: 0;
}

a {
  text-decoration: none;
}

body a {
  color: inherit;
}

em, i {
  font-style: normal;
}

b, strong, h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

li {
  list-style: none;
}

.clear:after {
  content: '';
  overflow: hidden;
  display: block;
  height: 0;
  clear: both;
}

.ml20 {
  margin-left: 20px;
}

//公共样式
.wrapContent {
  width: 100%;
  height: 100%;
  display: flex;
  .FL {
    width: 220px;
    display: flex;
    flex-direction: column;
    .logo {
      height: 60px;
      img {
        width: 58px;
        margin: 0px auto;
        display: block;
      }
    }
    .leftMenu {
      flex: 1;
      .ivu-menu {
        height: 100%;
      }
    }
    &.collapse {
      overflow: hidden;
      width: 64px;
      .logo {
        padding-top: 7.5px;
        img {
          width: 45px;
          margin: 0px auto;
        }
      }
      ul {
        width: 64px !important;
      }
      .ivu-menu-submenu-title > i {
        margin-right: 23px;
      }
      .ivu-menu-vertical .ivu-menu-submenu-title {
        white-space: nowrap;
      }
      .ivu-menu {
        .ivu-menu {
          display: none;
        }
      }
      .ivu-icon-ios-arrow-down {
        display: none;
      }
    }
  }
  .FR {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    .head {
      display: flex;
      justify-content: space-between;
      border-bottom: 1px solid #dcdee2;
      box-sizing: content-box;
      height: 60px;
      .headLeft {
        .ivu-menu-horizontal.ivu-menu-light:after {
          content: none;
        }
        .ivu-menu-horizontal .ivu-menu-item {
          padding: 0 25px 0 20px;
        }
        .pill {
          height: 20px;
          width: 20px;
          background-color: #44a1fb;
          color: #fff;
          border-radius: 50%;
          margin-right: 6px;
          line-height: 20px;
          text-align: center;
          display: inline-block;
        }
      }
      .headRight {
        //border-bottom: 1px solid #dcdee2;
        line-height: 60px;
        position: relative;
        padding: 0 30px 0 10px;
        &:after {
          content: "";
          background-color: #aaa;
          height: 40px;
          width: 1px;
          position: absolute;
          top: 10px;
          left: 0;
        }
        .role {
          font-size: 14px;
          .ivu-icon-ios-person-outline {
            font-size: 22px;
          }
        }
      }
    }
    .wrapper-main {
      flex: 1;
      overflow:hidden;
      /*滚动条样式*/
      ::-webkit-scrollbar { /*滚动条整体样式*/
        width: 6px; /*高宽分别对应横竖滚动条的尺寸*/
        height: 6px;
      }

      ::-webkit-scrollbar-thumb { /*滚动条里面小方块*/
        border-radius: 3px;
        background: #99cbe2;
      }

      ::-webkit-scrollbar-track { /*滚动条里面轨道*/
        border-radius: 0;
        background: #f0f1f3;
      }
    }
  }
}

//中间切换（页面）样式
.layout-content {
  width: 100%;
  height: 100%;
  background-color: @background-color2;
  padding: 20px;
  overflow-y: scroll;
  //position: relative;
  .breadcrumb {
    margin-bottom: 20px;
    line-height: 14px;
    font-size: 14px;
    color: @dark-gray-color;
    position: relative;
    a:hover {
      color: @dark-gray-hover;
    }
    .ivu-breadcrumb > span:last-child {
      font-weight: normal;
      color: @mid-gray-color;
    }
    .rightActions {
      position: absolute;
      width: 90px;
      height: 28px;
      background: @primary-color;
      border-radius: 14px;
      text-align: center;
      padding: 0;
      color: @white-color;
      border: none;
      margin-left: 260px;
      outline: none;
      cursor: pointer;
      line-height: 28px;
      top: -8px;
      right: 0px;
      &:hover {
        background: @primary-hover;
      }
    }
    .rightActions2 {
      right: 110px;
    }
  }
  .setScreensBody {

  }
  .tabs {
    overflow: visible;
    .ivu-tabs-bar .ivu-tabs-nav-container {
      height: 40px;
    }
    .ivu-tabs-bar {
      border: none;
    }
    .ivu-tabs-bar .ivu-tabs-tab {
      margin-right: 0;
      height: 40px;
      //width: 68px;
      min-width: 68px;
      text-align: center;
      border: none;
    }
    .ivu-tabs-nav .ivu-tabs-tab:hover {
      color: @primary-hover;
    }
    .ivu-tabs-content {
      margin-top: -16px;
    }
    .ivu-tabs-bar .ivu-tabs-tab-active {
      border-top: none;
    }
    .ivu-tabs-bar .ivu-tabs-tab {
      transition: none;
      background: none;
      padding: 10px 16px 4px;
    }
    .ivu-tabs-nav .ivu-tabs-tab {
      box-sizing: content-box;
      transition: none;
    }
    .ivu-tabs-tabpane {
      background-color: @white-color;
      //min-height: 100px;
    }
    .ivu-tabs-nav .ivu-tabs-tab-active {
      color: @primary-color;
      background: @white-color;
    }
    .ivu-tabs-bar .ivu-tabs-tab-active:before {
      content: '';
      display: block;
      width: 100%;
      height: 2px;
      background: @primary-color;
      position: absolute;
      top: 0;
      left: 0;
    }
    .ivu-checkbox-indeterminate .ivu-checkbox-inner {
      background-color: @primary-color;
      border-color: @primary-color;
    }
    &.marketALL, &.student { //市场下面重复名单样式突出
      .ivu-tabs-nav {
        .ivu-tabs-tab:nth-child(3) { //重复名单样式
          color: @tips-color;
        }
        .ivu-tabs-tab:nth-child(3).ivu-tabs-tab-active:before {
          background: @tips-color;
        }
      }
    }
    &.trial { //客户试听下面排课申请记录样式突出
      .ivu-tabs-nav {
        .ivu-tabs-tab:nth-child(5) { //课程计划样式
          color: @tips-color;
        }
        .ivu-tabs-tab:nth-child(5).ivu-tabs-tab-active:before {
          background: @tips-color;
        }
        .ivu-tabs-tab:nth-child(6) { //排课记录样式
          color: @tips-color;
        }
        .ivu-tabs-tab:nth-child(6).ivu-tabs-tab-active:before {
          background: @tips-color;
        }
      }
    }

  }
  .ivu-checkbox-indeterminate .ivu-checkbox-inner {
    background-color: @primary-color;
    border-color: @primary-color;
  }
  .ivu-select-item-selected, .ivu-select-item-selected:hover {
    color: @primary-color;
  }
  .checkBoxList li {
    display: inline-block;
    margin: 0 5px;
    padding: 0 8px;
    font-size: 13px;
    cursor: pointer;
    height: 32px;
    line-height: 32px;
    &.active {
      background-color: @primary-color;
      color: @white-color;
    }
  }
  .setFilter {
    position: relative;
    padding-bottom: 20px;
    background-color: #fff;
    .setScreens {
      position: absolute;
      top: -30px;
      right: 0px;
      z-index: 3;
      .setBtn {
        cursor: pointer;
        font-size: 12px;
        color: @primary-color;
        line-height: 20px;
        &:hover {
          color: @primary-hover;
        }
        i {
          font-size: 18px;
          margin-right: 10px;
          vertical-align: -2px;
        }
      }
      .adminSetBtn {
        color: @tips-color;
        &:hover {
          color: @tips-hover;
        }
      }

      .clickBtn {
        margin-top: 20px;
        text-align: center;
        button {
          width: 90px;
          height: 36px;
          border-radius: 18px;
        }
        .ivu-btn:focus {
          box-shadow: none;
        }
        .cancle {
          margin-right: 15px;
          background-color: @auxiliary-color2;
          &:hover {
            color: @primary-color;
            border-color: @primary-color;
          }
        }
        .confirm {
          background-color: @primary-color;
          border-color: @primary-color;
          &:hover {
            background-color: @primary-hover;
            border-color: @primary-hover;
          }
        }
      }
    }
    .allScreens {
      position: relative;
      &.hidden {
        //height: 100px;
        //overflow: hidden;
        animation: fold 0.2s;
        animation-fill-mode: forwards;
        .fold i {
          //transform:rotate(180deg);
          //color:red;
          animation: fold2 0.2s;
          animation-fill-mode: forwards; //动画地从一个地方移动到另一个地方，并让它停留在那里：
        }

      }
      @keyframes fold {
        0% {
          height: auto;
        }
        100% {
          height: 320px;
          overflow: hidden;
        }
      }
      @keyframes fold2 {
        0% {
        }
        100% {
          transform: rotate(-180deg);
        }
      }
      background-color: @white-color;
      padding: 30px 20px 6px;
      .fold {
        position: absolute;
        width: 84px;
        height: 50px;
        line-height: 50px;
        left: 50%;
        bottom: -14px;
        text-align: center;
        margin-left: -42px;
        span {
          cursor: pointer;
          font-size: 14px;
          color: @primary-color;
          i {
            font-size: 20px;
            margin-left: 4px;
          }
        }
      }
    }
  }

  .chooseScreens {
    padding-bottom: 18px;
    position: relative;
    overflow: hidden;
    .chooseTip {
      font-size: 12px;
      line-height: 30px;
      color: @tips-color;
      margin-bottom: 10px;
    }
    .clickBtns {
      margin-top: 30px !important;
      text-align: right !important;
      margin-right: 92.5px;
    }
    .filterSetting {
      display: flex;
      justify-content: space-between;
      margin-top: 3px;
      .fL {
        width: 340px;
        position: relative;
        .chooseTip {
          margin-bottom: 16px;
        }
        //.ivu-checkbox-group {
        //  padding: 20px;
        //}
      }
      .fR {
        width: 380px;
        position: relative;
        margin-left: 20px;
        display: flex;
        min-height: 200px;
        flex-direction: column;
        .chooseTip {
          margin-bottom: 0;
        }
        .fRTop {
          width: 100%;
          height: 30px;
        }
        .ivu-checkbox-group {
          flex: 5;
          background-color: @tableBgColor1;
          padding: 15px 20px;
          border: 1px solid @light-gray-hover;
          //min-height:220px ;
        }
      }
    }
    .checkALL {
      position: absolute;
      top: 6px;
      right: -62px;
    }
    .ivu-checkbox-group {
      white-space: pre-wrap; //换行
    }
    .ivu-checkbox-wrapper {
      width: 95px;
      margin-right: 16px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .ivu-checkbox-wrapper:nth-child(3n) {
      margin-right: 0px;
    }
    .ivu-checkbox + span {
      margin-left: 8px;
    }
  }
  .tableContent {
    margin-top: 10px;
    padding: 0 20px 40px;
    background-color: @white-color;
    .tableSetting {
      //line-height: 80px;
      padding: 0 0px 0 18px;
      display: flex;
      justify-content: space-between;
      .dataOperate {
        display: flex;
        //margin: 22px 0;
        /*float:left;*/
        padding: 4px 0 26px;
        p:first-child {
          //line-height: 80px;
          margin-top: 28px;
        }
        p {
          color: @btn-disable-color;
          span.num {
            margin: 0 3px;
            display: inline-block;
            width: 14px;
            text-align: center;
          }
        }
        button {
          height: 28px;
          //width: 70px;
          border-radius: 14px;
          text-align: center;
          padding: 0 8px;
          margin-left: 10px;
          color: @primary-color;
          border: 1px solid @primary-color;
          background-color: @btn-bg-color;
          margin-top: 22px;
          min-width: 66px;
          &:hover {
            color: @primary-hover;
            border: 1px solid @primary-hover;
          }
          //margin-top: 20px;
        }
        .ivu-btn:focus {
          box-shadow: none;
        }
        button.btn2 {
          color: @tips-color;
          border: 1px solid @tips-color;
          background-color: @btn-bg2-color;
          &:hover {
            color: @tips-hover;
            border: 1px solid @tips-hover;
          }
        }
        button.btn3 {
          color: @error-color;
          border: 1px solid @error-color;
          background-color: @btn-bg3-color;
          &:hover {
            color: @error-hover;
            border: 1px solid @error-hover;
          }
        }
        button.btn4 {
          color: @error-color;
          border: 1px solid @error-color;
          background-color: @btn-bg3-color;
          &:hover {
            color: @error-hover;
            border: 1px solid @error-hover;
          }
        }
      }
      .sortTables {
        display: flex;
        /*padding-top: 25px;*/
        p {

        }
        /*float:right;*/
        .ivu-select, .ivu-input-wrapper {
          //margin-top: 22px;
          margin: 22px 0;
        }
        .ivu-select-selection {
          background-color: @auxiliary-color4;
          border: none;
          border-radius: 0px;
          padding-left: 20px;
        }
        .select1 .ivu-select-selection {
          border-top-left-radius: 16px;
          border-bottom-left-radius: 16px;
        }
        .ivu-input {
          background-color: @auxiliary-color4;
          border: none;
          border-radius: 0px;
          border-top-right-radius: 16px;
          border-bottom-right-radius: 16px;
          text-align: center;
          height: 36px;
        }
        .ivu-select-visible .ivu-select-selection {
          box-shadow: none;
        }
        .ivu-input:focus {
          box-shadow: none;
        }
        .ivu-select-single .ivu-select-selection {
          height: 36px;
        }
        .ivu-select-single .ivu-select-selection .ivu-select-placeholder, .ivu-select-single .ivu-select-selection .ivu-select-selected-value {
          height: 36px;
          line-height: 36px;
        }
      }
      .sortData {
        position: relative;
        .emptyData {
          position: absolute;
          top: 22px;
          right: 0px;
          cursor: pointer;
          color: @mid-gray-color;
          font-size: 14px;
          width: 30px;
          height: 36px;
          line-height: 36px;
          text-align: center;
          //background-color: red;
          border-bottom-right-radius: 18px;
          border-top-right-radius: 18px;
          &:hover {
            color: @mid-gray-hover;
          }
        }
      }
      button.btnSearch {
        height: 36px;
        line-height: 36px;
        width: 36px;
        border-radius: 18px;
        text-align: center;
        padding: 0;
        margin: 22px 20px 0 20px;
        color: @white-color;
        border: none;
        background-color: @primary-color;
        font-size: 14px;
        & > span {
          vertical-align: 0;
        }
        &:hover {
          background-color: @primary-hover;
        }
        &:focus {
          box-shadow: none;
        }
        i {
          //margin-right: 10px;
          vertical-align: -1px;
        }
        //margin-top: 20px;
      }
      .setTables {
        //width: 80px;
        line-height: 80px;
        display: inline-block;
        .setBtn {
          cursor: pointer;
          font-size: 12px;
          color: @primary-color;
          line-height: 20px;
          &:hover {
            color: @primary-hover;
          }
          i {
            font-size: 18px;
            margin-right: 10px;
            vertical-align: -2px;
          }
        }
        .adminSetBtn {
          color: @tips-color;
          &:hover {
            color: @tips-hover;
          }
        }
        //.chooseScreens {
        //  padding-bottom: 18px;
        //  .chooseTip {
        //    font-size: 12px;
        //    line-height: 30px;
        //    color: @tips-color;
        //    margin-bottom: 10px;
        //  }
        //  .ivu-checkbox-group {
        //    white-space: pre-wrap; //换行
        //  }
        //  .ivu-checkbox-wrapper {
        //    width: 95px;
        //    margin-right: 16px;
        //    overflow: hidden;
        //    text-overflow: ellipsis;
        //    white-space: nowrap;
        //  }
        //  .ivu-checkbox-wrapper:nth-child(3n) {
        //    margin-right: 0px;
        //  }
        //  .ivu-checkbox + span {
        //    margin-left: 8px;
        //  }
        //}
        .clickBtn {
          margin-top: 20px;
          text-align: center;
          button {
            width: 90px;
            height: 36px;
            border-radius: 18px;
          }
          .ivu-btn:focus {
            box-shadow: none;
          }
          .cancle {
            margin-right: 15px;
            background-color: @auxiliary-color2;
            &:hover {
              color: @primary-color;
              border-color: @primary-color;
            }
          }
          .confirm {
            background-color: @primary-color;
            border-color: @primary-color;
            &:hover {
              background-color: @primary-hover;
              border-color: @primary-hover;
            }
          }
        }
      }
    }

    .ivu-table-wrapper {
      border: none;
    }
    .tableData {
      //margin-bottom: 20px;
      .ivu-table table {
        width: 100% !important;
        //overflow-x: scroll;

      }
      .ivu-table-header {
        background-color: @class-blue;
        border-bottom: 1px solid @light-gray-hover;
      }
      .ivu-table-fixed-header {
        background-color: @class-blue;
        border-top: 1px solid @light-gray-hover;
        border-bottom: 1px solid @light-gray-hover;
      }
      .ivu-table-fixed-right::before, .ivu-table-fixed::before {
        content: none;
      }
      .ivu-table {
        border: 1px solid @light-gray-hover;
      }
      .ivu-table:before {
        background-color: @light-gray-hover;
      }
      .ivu-table:after {
        background-color: @light-gray-hover;
      }
      .ivu-table thead tr:first-child th {
        height: 60px;
        font-size: 16px;
        font-weight: normal;
        text-align: center;
        color: @dark-gray-color;
        //background-color: @class-blue;
        //border-bottom: 1px solid @light-gray-hover;
        //&:nth-child(3n-2) {
        //  background: @classA-blue;
        //  font-size: 16px;
        //}
        //
        //&:nth-child(3n-1) {
        //  background: @classA-yellow;
        //  font-size: 16px;
        //}
        //
        //&:nth-child(3n) {
        //  background: @classA-violet;
        //  font-size: 16px;
        //}
      }
      //.ivu-table thead tr:not(:first-child) th {
      //  line-height: 36px;
      //  font-size: 14px;
      //  font-weight: normal;
      //  text-align: center;
      //  color: @dark-gray-color;
      //}
      //
      //.ivu-table thead tr:nth-child(2) th {
      //  background: @classB-color;
      //  font-size: 14px;
      //}
      //
      //.ivu-table thead tr:nth-child(3) th {
      //  background: @classC-color;
      //  font-size: 14px;
      //}
      //.ivu-table thead tr:nth-child(4) th {
      //  background: @classD-color;
      //  font-size: 14px;
      //}

      .ivu-table tbody td {
        /*padding: 6px 0 !important;*/
        font-size: 14px;
        text-align: center;
        color: @dark-gray-color;
      }
      .ivu-table tbody tr:nth-child(2n-1) {
        background-color: @tableBgColor1;
      }
      .ivu-table tbody tr:nth-child(2n) {
        background-color: @tableBgColor2;
      }
      .ivu-table th {
        //border: 1px solid #fff;
        border: none;
        height: 36px;
        background: @class-blue;
      }
      .ivu-table td {
        //border: 1px solid #fff;
        border: none;
        height: 36px;
        background: none;
      }
    }
  }
  .ivu-input-icon {
    z-index: 2;
  }
  .ivu-page {
    text-align: center;
    margin-top: 30px;
    .ivu-page-item:hover {
      border-color: @primary-hover;
      a {
        color: @primary-hover;
      }
    }
    .ivu-page-item-active {
      border-color: @primary-color;
      a {
        color: @primary-color;
      }
    }
    .ivu-page-next:hover, .ivu-page-prev:hover {
      border-color: @primary-hover;
      a {
        color: @primary-hover;
      }
    }
    .ivu-select-item-selected {
      color: @primary-color;
    }
    .ivu-select-item-selected:hover {
      color: @primary-hover;
    }
    .ivu-page-options-elevator input:focus {
      color: @primary-color;
      border-color: @primary-color;
    }
  }
}

/*表单*/
.ivu-form .ivu-form-item-label {
  font-size: 14px;
  color: @mid-gray-color;
}

.ivu-btn-primary:focus, .ivu-btn:focus {
  box-shadow: none;
}

.ivu-switch-checked {
  border-color: @primary-color;
  background-color: @primary-color;
}

.ivu-switch:focus {
  box-shadow: none;
}

.ivu-radio-wrapper-checked, .ivu-checkbox-wrapper-checked {
  color: @primary-color;
}

.ivu-date-picker-cells-focused em {
  box-shadow: 0 0 0 1px @primary-color inset;
}

.ivu-date-picker-cells-cell-today em:after, .ivu-date-picker-cells-cell-selected em, .ivu-date-picker-cells-cell-selected:hover em {
  background: @primary-color;
}

.ivu-radio-checked .ivu-radio-inner, .ivu-input:hover, .ivu-input:focus {
  border-color: @primary-color;
}

.ivu-radio-inner:after {
  background-color: @primary-color;
}

.ivu-radio-checked:hover .ivu-radio-inner, .ivu-date-picker-focused input {
  border-color: @primary-color;
}

.ivu-select-visible .ivu-select-selection, .ivu-select-selection:hover, .ivu-select-selection-focused {
  border-color: @primary-color;
}

.ivu-select-multiple .ivu-select-item-selected {
  color: @primary-color;
}

.ivu-select-multiple .ivu-select-item-selected:after {
  color: @primary-color;
}

.ivu-checkbox-checked .ivu-checkbox-inner {
  border-color: @primary-color;
  background-color: @primary-color;
}

.ivu-checkbox-checked:hover .ivu-checkbox-inner {
  border-color: @primary-color;
}

.submit {
  width: 120px;
  height: 36px;
  border-color: @primary-color;
  background-color: @primary-color;
  text-align: center;
  color: @white-color;
  font-size: 14px;
  border-radius: 18px;
}

.ivu-btn-primary:hover {
  color: #ffffff;
  background-color: @primary-hover;
  border-color: @primary-hover;
}
